
import * as THREE from 'three';
interface sceneParam {
  id:string
}
class sceneMrg {
  constructor (param:sceneParam) {
    this.init(param)
  }
  init (param:sceneParam) {
    const canvas = document.getElementById(param.id) as any;
    const renderer = new THREE.WebGLRenderer({ canvas });
    console.log("canvas1:", canvas.width, canvas.height)
    const scene = new THREE.Scene();
    const camera = new THREE.PerspectiveCamera(75, canvas.width / canvas.height, 0.1, 1000);
    camera.position.z = 5;

    // ---add box---
    const geometry = new THREE.BoxGeometry();
    const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });
    const cube = new THREE.Mesh(geometry, material);

    scene.add(cube);

    function animate() {
      requestAnimationFrame(animate);
    
      cube.rotation.x += 0.01;
      cube.rotation.y += 0.01;
    
      renderer.render(scene, camera);
    }
    
    animate();

  }
}


export default sceneMrg